{{left_sidebar_enabled=right_sidebar_enabled=False}}
{{extend 'layout.html'}}
{{=SCRIPT(_src=URL('static', 'js/jquery.timeago.js'))}}

<style type="text/css"> 
//input[type="text"] { width: 100% }
div#spacer{ width: 100%}
.spacer{ width: 25%}
</style>
    <link href={{=URL('static','css/engage.itoggle.css')}} rel="stylesheet" type="text/css" />
    {{=SCRIPT(_src=URL('static', 'js/jquery.easing.1.3.js'))}}
    {{=SCRIPT(_src=URL('static', 'js/engage.itoggle.js'))}}    
    <script type="text/javascript">
        $().ready(function() {

            $('input#example_1').iToggle({
                easing: 'easeOutExpo',
                onClickOn: function(){
                    $('input:checkbox').addClass('iT_checkbox_on');
                },
                onClickOff: function(){
                    $('input:checkbox').removeClass('iT_checkbox_on');
                }
            });
            
            $('.timeago').timeago();
            $('#spacer').height(window.innerHeight * 0.4 + 'px');
        });
    </script>
<script>
</script>
    <div id="itoggle" class="project">
        <input type="checkbox" id="example_1" />
    </div>
<div id='spacer' style="height: 100px;"></div>

<table width=100%>
{{=TR(TD(INPUT(),BUTTON('Search'), _colspan=5, _align='center'))}}
{{for location in locations:}}
<tr>
{{=TD(_class='spacer')}}
{{=TD(location.instructor.ping)}}
{{=TD(location.instructor.first_name + ' ' + location.instructor.last_name)}}
{{if location.location:}}
{{=TD(location.location.room.room)}}
{{=TD(_class='timeago', _title=location.location.timestamp)}}
{{pass}}

</tr>
{{pass}}
</table>
